<template>
  <div class="credit-accredit">
    <div class="credit-accredit-header">
      <img src="../../images/tencentCredit/tencentCredit.jpg"/>
    </div>
    <div class="credit-accredit-content">
      <div class="accredit-content-item">
        <span class="circle-gray"></span>
        <span>获取你的公开信息(昵称、头像、性别等)</span>
      </div>
      <div class="accredit-content-item"><span class="circle-gray"></span><span>使用身份信息(姓名、证件号)办理业务</span></div>
      <div class="accredit-content-item">
        <span class="circle-gray"></span><span>查询您的腾讯征信等信用信息,如尚未开通腾讯征信服务,则予给开通。</span>
      </div>
    </div>
    <div class="credit-accredit-footer">
      <div class="footer-agreement">
        <input type="checkbox" id="verifySubmit" name="verifySubmit" v-model="checked">
        <label for="verifySubmit">
          确认授权即表示同意
        </label>
        <!--<a>《用户授权协议》</a>-->
        <a @click.stop="$router.push('/tencentClause')">《腾讯征信协议及相关授权条款》</a>
      </div>
      <div class="footer-button">
        <x-button type="primary" @click.native="submit">确定</x-button>
      </div>
    </div>
  </div>
</template>
<script>
  export default {
    data () {
      return {
        checked: false
      }
    },
    methods: {
      submit () {
        if (this.checked) {
          let userInfo = JSON.parse(window.localStorage.getItem('userInfo'))
          let requestData = {
            idCard: userInfo.idCard, // 身份证号
            name: userInfo.trueName, // 用户名
            mobile: userInfo.mobile // 手机号码
          }
          this.$axiosPosting(this.$api.creditAuthorize, requestData).then(data => {
            if (data.code === '0000') {
              let newUserInfo = Object.assign({}, userInfo, {'isCreditAuthorize': 1})
              window.localStorage.setItem('userInfo', JSON.stringify(newUserInfo))
              this.$router.push(`/${this.$route.query.from}`)
            } else {
              this.$vux.alert.show({
                title: '提示',
                content: data.msg
              })
            }
            console.log(data)
          })
        } else {
          this.$vux.toast.text('请同意授权', 'middle')
        }
      }
    }
  }
</script>
<style scoped lang="less">
  .credit-accredit {
    -webkit-overflow-scrolling : touch;
  }

  .credit-accredit-header {
    img {
      height: auto;
      width: 100%;
    }
  }

  .credit-accredit-content {
    padding: .6rem .75rem 0;
    .accredit-content-item {
      margin-bottom: 5px;
      line-height: 16px;
    }
    span {
      font-size: 13px;
      color: #a3a3a3;
    }
    .circle-gray {
      width: .6rem;
      height: .6rem;
      border-radius: 50%;
      background-color: #a3a3a3;
      display: inline-block;
      margin-right: .35rem;
    }
  }
  .credit-accredit-footer{
    padding: 0 .75rem 1.75rem;
    bottom:1.3rem;
    margin-bottom: -.2rem;
  }
  .footer-agreement{
    padding: .6rem .75rem;
    font-size: 13px;
    color: #a3a3a3;
    input{
      vertical-align: middle;
    }
    a{
      color: #ff9600;
    }
   }
</style>

